<template>
  <div>
    <alarmAanalysis class="h-full"
      :title="title"
      @changeList="changeList"
      :data="data"
      :timeList="timeList"
      :dataList="dataList"
      :selectTime="selectTime"
      :legendList="legendList"
    />
  </div>
</template>
<script lang="ts" setup>
import alarmAanalysis from "@/views/large-data-screen/component/public/alarm-analysis.vue"
import {getScreealarm,} from '@/api/screen/largeData'

const title = ref('告警分析')
const legendList = ref(['真实', '误报', '测试'])
//用于控制图表样式
const data = ref([
    // {left: '0', top: '30', width: '99%', height: '140px',},
  { left: '10px', right: '10px', width: '95%', bottom: '20px' },
    {height2: '200px'}
  ]
)
const selectTime = ref(0) //选择时间
// 时间选择
const timeList = ref([
  {
    name: '月',
    id: 3
  },
  {
    name: '年',
    id: 4

  },

])

//获取图表数据
const dataList = ref([])
// 默认为本月
const alarmConfirmDT = ref(3)
onMounted(() => {
  getcountalarm()
})
//点击年月日
const changeList = (item, index) => {
  selectTime.value = index
  alarmConfirmDT.value = item.id
  getcountalarm()
}
//近7日告警态势
const getcountalarm = () => {
  getScreealarm(
    {
      searchType: 1, //查询类型(1 单位 2 -个体概览)
      alarmConfirmDT: alarmConfirmDT.value,//告警类型统计 （ 0-全部  3 本月 4 年）
      alarmEventDT: 0,//告警事件 （ 0-全部 1 日 2周 3 月 4 年）
      systematicId: '',//应用系统id
      days: ''         //最近几日（  7，15）

    }
  ).then(res => {

    res.result.alarmConfirm.data.forEach(item => {
      // item.value = [20, 92, 1, 34, 190,]
      if (item.name == '真实') {
        item.color = '#2664B8'
      }
      if (item.name == '误报') {
        item.color = '#D9972A'
      }
      if (item.name == '忽略') {
        item.color = '#27B3C5'
      }
    })
    dataList.value = res.result.alarmConfirm

  })
}

</script>
